<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" href="./Css/index.css" />
<!-- 不在首页的样式  列表页-->
<link rel="stylesheet" href="./Css/list.css" />
<!-- 不在首页的样式  列表页-->
<link rel="stylesheet" href="./Css/content.css" />
<script type="text/javascript" src="./js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="./js/content.js"></script>
<title>Document</title>
</head>
<body>

	<!-- 顶部开始 -->
	<div id="topout">
		<div class="topin">
			<p>您好，欢迎来到特步官方商城_专卖特步运动鞋,特步运动服,运动配饰 - 特步官方旗舰店！</p>
		</div>	
	</div>
	<!-- 顶部结束 -->
	<!-- logo部分开始 -->
	<div id="upmenu">
		<div class="logo">
			<img src="./Img/2.png" alt="" />
		</div>
		<div class="logoright">
			<a href="">400-887-6666 转2</a>
			<a href="">在线调查&nbsp|</a>
			<a href="">在线客服&nbsp|</a>
			<a href="">新手指南&nbsp|</a>
			<a href="">DIY专区&nbsp|</a>
			<a href="">手机特步APP&nbsp|</a>
			<a href="">特步订单&nbsp|</a>
			<a href="">注册&nbsp|</a>
			<a href="">登陆&nbsp|</a>
		</div>

		<div class="search">
			<form action="" method="">
				<input type="text" name="search" id="biaodan" value="搜索" />
			</form>
			<div class="btn"><a href=""><img src="./Img/3.png" alt="" /></a></div>
			<div class="shopcar"></div>
			<p>购物车:<span>&nbsp<a href="" style="color:red">0</a>&nbsp</span>件</p>
			<div class="jiesuan">去结算<div class="jiantou"></div></div>
		</div>	
	</div>
	<!-- logo部分结束 -->
	<!-- 导航条开始 -->
	<div id="menu">
		<div class="menuin">
			<a href="">运动包</a>
			<a href="">运动包</a>
			<a href="">运动包</a>
			<a href="">运动包</a>
			<a href="">运动包</a>
			<a href="">运动</a>
			<a href="">运动</a>
			<a href="">运动</a>
			<a href="">运动</a>
			<a href="">运动</a>
			<a href="">运动</a>
			<a href="">运动</a>
			<a href="">运动</a>
		</div>	
	</div>
	<!-- 导航条结束 -->
	<div id="location">
		您当前的位置：<span><a href="">首页</a> > <a href="">男装</a></span>
	</div>
	<div id="con">
		<!-- 图开始 -->
		<div class="left-con">
			<!-- 大图片，小图片开始 -->
			<div class="big-pic" id="left">
				<img src="./Img/76.jpg" alt="" style="display:block" />
				<img src="./Img/14.jpg" alt="" />
				<img src="./Img/27.jpg" alt="" />
				<img src="./Img/28.jpg" alt="" />
				<!-- 遮盖 -->
				<div class="upbox" id="up"></div>
				<!-- 色块 -->
				<div class="small-box" id="sbox"></div>				
			</div>
			
			<div class="small-pic">
				<img src="./Img/76.jpg" alt="" />
				<img src="./Img/14.jpg" alt="" />
				<img src="./Img/27.jpg" alt="" />
				<img src="./Img/28.jpg" alt="" />			
			</div>
			<!-- 大图 小图 结束 -->
			<!-- 放大镜 datu-->
			<div class="biggest" id="right">
				<img src="./Img/76.jpg" alt="" id="pi" style="display:block" />
				<img src="./Img/82.jpg" alt="" id="pi"/>
				<img src="./Img/76.jpg" alt="" id="pi"/>
				<img src="./Img/76.jpg" alt="" id="pi"/>
			</div>
<script>
	window.onload=function(){		
		var left=document.getElementById('left');
		var sbox=document.getElementById("sbox");
		var right=document.getElementById("right");
		var pi=document.getElementById("pi");
		var up=document.getElementById("up");
		up.onmousemove=function(e){
			var re=window.event||e;
			var old_left=re.offsetX||re.layerX;
			var old_top=re.offsetY||re.layerY;
			var se_left=old_left-125; 
			var se_top=old_top-125;
			if(se_top>225){
				se_top=225;
			}
			if(se_top<0){
				se_top=0;
			}
			if(se_left>225){
				se_left=225;
			}
			if (se_left<0) {
				se_left=0
			}
			sbox.style.left=se_left+"px";
			sbox.style.top=se_top+"px";
			pi.style.left=-2*se_left+"px";
			pi.style.top=-2*se_top+"px";
		}
		up.onmouseover=function(){
			sbox.style.display="block";
			right.style.display="block";
		}
		up.onmouseout=function(){
			sbox.style.display="none";
			right.style.display="none";
		}
	}
 </script>	
		</div>
		<!-- 图结束 -->
		<!-- 右侧的购买开始 -->
		<div class="right-con">
			<div class="con-dis">【特步官方】限量特供巴西队标纪念款文化衫女短<span>T986228011027</span></div>
			<div class="con-code">商品货号： 986228011027</div>
			<div class="con-price">官方售价：<span>￥ 77777</span></div>
			<div class="con-code">专柜价格：￥<span> 77777</span></div>
			<div class="con-num">已经累计售出： <span>0</span> 件</div>
			<div class="con-mon">单件赠送金币： <span>600</span> 分</div>
			<div class="con-com">商品满意度：用星星进行打分 <span>10</span>&nbsp&nbsp&nbsp共有 0 条评论</div>
			<div class="goods-choose">
				<div class="choose-color">选中的颜色：<span>请选择颜色</span></div>
				<div class="choose-pic">
					<img src="./Img/77.jpg" alt="" color="红色"/>
					<img src="./Img/77.jpg" alt="" color="绿色"/>
					<img src="./Img/77.jpg" alt="" color="蓝色"/>
				</div>
				<div class="choose-int">尺码：<span>请选择尺码</span><a href="" style="color:blue"> 尺码对照表？</a></div>
				<div class="int">
					<div class="int-box">S</div><div class="int-box">M</div><div class="int-box">L</div>
					<div class="int-box">XL</div><div class="int-box">XXL</div><div class="int-box">XXXL</div>
				</div>			
				<div class="buy">我要买：<form action="">&nbsp<input type="text" value="1" style="text-align:center" /></form>件(库存222件)</div>
				<div class="car"><a href=""><img src="./Img/79.jpg" alt="" /></a><a href=""><img src="./Img/78.jpg" alt="" /></a><br/><br/><a href=""><img src="./Img/80.jpg" alt="" /></a></div>
				<div class="fenxiang"><span>分享到：</span><a href="" class="fen1 fen"></a><a href="" class="fen2 fen"></a><a href="" class="fen3 fen"></a></div>
			</div>
		</div>
		<!-- 右侧的购买结束 -->
	</div>
	<!-- 所有展示 -->
	<div id="show">
		<!-- 左侧看过，浏览的内容开始 -->
		<div class="looked">
			<!-- 浏览该商品的人还浏览了 -->
			<div class="right-show">
				<div class="list">浏览该商品的人还浏览了</div>
				<div class="list-one">
					<div class="list-pic"><a href=""><img src="./Img/75.jpg" alt="" /></a></div>
					<div class="list-dis"><a href="">特步正品2014全新上架男跑鞋运动鞋时尚休闲鞋98</a></div>
					<div class="list-price"><a href="">￥ 434.00</a></div>
				</div>
				<div class="list-one">
					<div class="list-pic"><a href=""><img src="./Img/75.jpg" alt="" /></a></div>
					<div class="list-dis"><a href="">特步正品2014全新上架男跑鞋运动鞋时尚休闲鞋98</a></div>
					<div class="list-price"><a href="">￥ 434.00</a></div>
				</div>
				<div class="list-one">
					<div class="list-pic"><a href=""><img src="./Img/75.jpg" alt="" /></a></div>
					<div class="list-dis"><a href="">特步正品2014全新上架男跑鞋运动鞋时尚休闲鞋98</a></div>
					<div class="list-price"><a href="">￥ 434.00</a></div>
				</div>
				<div class="list-one one">
					<div class="list-pic"><a href=""><img src="./Img/75.jpg" alt="" /></a></div>
					<div class="list-dis"><a href="">特步正品2014全新上架男跑鞋运动鞋时尚休闲鞋98</a></div>
					<div class="list-price"><a href="">￥ 434.00</a></div>
				</div>
			</div>
			<!-- 浏览记录 -->
			<div class="right-show">
				<div class="list">浏览记录&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<a href="" style="font-size:12px;color:#A7A7A7">清除</a></div>
				<div class="list-one">
					<div class="list-pic"><a href=""><img src="./Img/75.jpg" alt="" /></a></div>
					<div class="list-dis"><a href="">特步正品2014全新上架男跑鞋运动鞋时尚休闲鞋98</a></div>
					<div class="list-price"><a href="">￥ 434.00</a></div>
				</div>
				<div class="list-one one">
					<div class="list-pic"><a href=""><img src="./Img/75.jpg" alt="" /></a></div>
					<div class="list-dis"><a href="">特步正品2014全新上架男跑鞋运动鞋时尚休闲鞋98</a></div>
					<div class="list-price"><a href="">￥ 434.00</a></div>
				</div>
			</div>
			<!-- 买过该商品的用户还买过 -->
			<div class="bid">
				<div class="bid-top">买过该商品的用户还买过</div>
				<div class="bid-pic"><a href=""><img src="./Img/81.jpg" alt="" /></a></div>
				<div class="bid-disc"><a href="">特步正品女装夏季透气时尚短袖t恤女POLO衫FW470021</a></div>
				<div class="bid-price"><a href="">￥ 544.00</a></div>
				<div class="bid-pic"><a href=""><img src="./Img/81.jpg" alt="" /></a></div>
				<div class="bid-disc"><a href="">特步正品女装夏季透气时尚短袖t恤女POLO衫FW470021</a></div>
				<div class="bid-price"><a href="">￥ 544.00</a></div>
			</div>
		</div>
		<!-- 左侧看过，浏览的内容结束 -->
		<!-- 右侧细节开始 -->
		<div class="details">
			<!-- 经常一起购买的商品有 -->
			<div class="gooda">
				<div class="together">经常一起购买的商品有</div>
				<div class="det">
					<div class="det-pic"><a href=""><img src="./Img/82.jpg" alt="" /></a></div>
					<div class="det-disc"><a href="">特步正品女装夏季透气时尚短袖t恤女POLO衫FW470021</a></div>
					<div class="det-price"><a href="">￥ 233.00</a></div>
				</div>
				<div class="det">
					<div class="det-pic"><a href=""><img src="./Img/82.jpg" alt="" /></a></div>
					<div class="det-disc"><a href="">特步正品女装夏季透气时尚短袖t恤女POLO衫FW470021</a></div>
					<div class="det-price"><a href="">￥ 233.00</a></div>
				</div>
				<div class="det">
					<div class="det-pic"><a href=""><img src="./Img/82.jpg" alt="" /></a></div>
					<div class="det-disc"><a href="">特步正品女装夏季透气时尚短袖t恤女POLO衫FW470021</a></div>
					<div class="det-price"><a href="">￥ 233.00</a></div>
				</div>
				<div class="det">
					<div class="det-pic"><a href=""><img src="./Img/82.jpg" alt="" /></a></div>
					<div class="det-disc"><a href="">特步正品女装夏季透气时尚短袖t恤女POLO衫FW470021</a></div>
					<div class="det-price"><a href="">￥ 233.00</a></div>
				</div>
			</div>
			<!-- 中间tab切换 -->
			<div id="tab">
				<a href="javascript:;">商品介绍</a>
				<a href="javascript:;">商品评论</a>
				<a href="javascript:;">商品咨询</a>
				<a href="javascript:;">商品服务</a>
				<a href="javascript:;">售后尺码</a>
			</div>
			<!-- 商品介绍 -->
			<div class="detail">
				<div class="big-pic">
				<div id="big-pic1"><img src="./Img/83.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/84.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/85.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/86.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/87.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/88.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/89.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/90.jpg" alt="" /></div>
				<div id="big-pic1"><img src="./Img/91.jpg" alt="" /></div>				
				</div>
			</div>
			
			<!-- 商品评论 -->
			<div class="detail"  style="display:none">
				<div id="comment">
				<form action="" method="post" class="form">
					<textarea name="com-con" cols="90" rows="5">请评价该商品！</textarea>
				</form>
				<div class="star">
					<div class="goods-star">商品满意度：<a href="">星星评价分数</a>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp共有5条评论<a href=""><img src="./Img/2.gif" alt="" /></a></div>
					<p>发表评论可获得积分 （<a href="">详见积分政策</a>） 购买过该商品的用户才能进行评价</p>
				</div>
				<!-- 第一条评论 -->
				<div class="com-show">
					<div class="com-nic">呢称：</div>
					<div class="com-say">
						<div class="com-time">2014-4-3 17:23:23>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp昵称</div>
						<div class="com-content">评论的内容</div>
					</div>
				</div>
				<!-- 第二条评论 -->
				<div class="com-show">
					<div class="com-nic">呢称：</div>
					<div class="com-say">
						<div class="com-time">2014-4-3 17:23:23>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp昵称</div>
						<div class="com-content">评论的内容</div>
					</div>
				</div>
				<div class="com-show">
					<div class="com-nic">呢称：</div>
					<div class="com-say">
						<div class="com-time">2014-4-3 17:23:23>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp昵称</div>
						<div class="com-content">评论的内容</div>
					</div>
				</div>
				<div class="com-show">
					<div class="com-nic">呢称：</div>
					<div class="com-say">
						<div class="com-time">2014-4-3 17:23:23>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp昵称</div>
						<div class="com-content">评论的内容</div>
					</div>
				</div>
				</div>
			</div>
			
			<!-- 我要咨询 -->
			<div class="detail" style="display:none">
				<div id="ask">
				<form action="" method="post">
					<span>咨询标题：&nbsp</span><input type="text" name="title" class="title" /><br/><br/>
					<span>咨询内容:</span><br/><br/><textarea name="con" cols="90" rows="5"></textarea><br/><br/><br/>
					<p>温馨提示：因厂家更改产品包装、产地或者更换随机附件等没有任何提前通知，且每位咨询者购买情况、提问时 间等不同，为此以下回复仅对提问者3天内有效，其他网友仅供参考！若由此给您带来不便请多多谅解，谢谢！</p> 
					<div><a href=""><img src="./Img/23.png" alt="" /></a></div>
				</form>
				</div>
			</div>
			
			<!-- 售后服务 -->
			<div class="detail" style="display:none">
				<div id="after-sales">			
				<p>售后服务</p>
				<p>货到付款：配送员将商品送到时以现金方式付款。如订单金额高于2000元，则不支持现金支付方式。<br/> 
				网银支付：其中涵盖银行包括中国工商银行、中国农业银行、中国建设银行、中国交通银行、中国民生银行、中国银行、招商银行、北京银行、华夏银行、兴业银行、中信银行、上海浦东发展银行、广东发展银行、深圳发展银行、平安银行、广银联。</p>
				<p>快递送货上门时，请您务必当面仔细核对是否有发货单，并对照发货单核对商品及配件、商品数量、发票（如有），如果出现商品数量缺少、 商品破损等情况，请您当场办理整单商品的拒收。若订单中含有特惠品，请一并退回。一旦您确认签字，我们将无法为您办理退换或补发。款 到发货订单，在未打开外包装前，可以当场全部拒收；如开箱验货后发现上述问题，请与米尚优品客服中心联系，客服电话：4006-088-066（ 仅收市话费）。</p>			
				</div>
			</div>
			

		</div>
		<!-- 右侧细节结束 -->
	</div>
	<!-- 所有展示结束 -->
	
	
</body>
</html>
